border - bottom - color

Internet Explorer

Chrome

Opera

Safari

Firefox

7.0

8.0

9.0

7.0

8.0

9.6

10.0

10.0

3.1

4.0

5.0

3.0

3.6

4.0

Частково

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

 

Коротка інформація

CSS

CSS1, CSS2.1

Значення за умовчанням

Значення кольору, задане через color

Наслідує

Ні

Застосовується

До усіх елементів

Аналог HTML

<img border > | <table border>

Посилання на специфікацію

http://www.w 3.org/TR/CSS21/box.html#border - color - properties

Опис

Встановлює колір межі внизу елементу.

Синтаксис

border - bottom - color: колір | transparent | inherit

Значення

Колір можна задавати трьома способами.

1. По його назві

Браузери підтримують деякі кольори по їх назві.

2. По шістнадцятиричному значенню

Для завдання кольорів використовуються числа в шістнадцятиричному коді. Шістнадцятирична система, на відміну від десяткової системи, базується, як випливає з її назви, на числі 16. Цифри будуть наступні: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Цифри від 10 до 15 замінені латинськими буквами. Числа більше 15 в шістнадцятиричній системі утворюються об'єднанням двох чисел в одно. Наприклад, числу 255 в десятковій системі відповідає число FF в шістнадцятиричній системі. Щоб не виникало плутанини у визначенні системи числення, перед шістнадцятиричним числом ставлять символ грат #, наприклад #666999. Кожен з трьох кольорів - червоний, зелений і синій - може набувати значень від 00 до FF. Таким чином, позначення кольору розбивається на три складові #rrggbb, де перші два символи відмічають червону компоненту кольору, два середніх - зелену, а два останніх - синю. Допускається використовувати скорочену форму виду #rgb, де кожен символ слід подвоювати. Так, запис #fe0 слід розцінювати як #ffee00.

3. За допомогою RGB

Можна визначити колір використовуючи значення червоною, зеленою і синій складовій в десятковому численні. Значення кожного з трьох кольорів може набувати значень від 0 до 255. Також можна задавати колір в процентному відношенні.

transparent Встановлює прозорий колір.

inherit Наслідує значення батька.

Приклад

HTML 4.0  CSS 2.1 IE 6 IE 7 IE 8 Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http ://www.w 3.org/TR/html4/strict.dtd">

<html>

  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=windows - 1251">

    <title>border - bottom - color</title>

    <style type="text/css">

      DIV#panel {

        background: #ccc; /* Колір фону */

      }

   #   #panel P {

        padding: 5px; /* Додаємо поля */

        margin: 0; /* Прибираємо відступи у параграфа */

      }

   #   #panel P#title {

        background: navy; /* Колір фону */

        color: white; /* Колір тексту */

        border - bottom - width: 2px; /* Товщина лінії внизу */

        border - bottom - style: solid; /* Стиль лінії внизу */

        border - bottom - color: white; /* Колір лінії внизу */

      }

    </style>

  </head>

  <body>

 

    <div id="panel">

    <p id="title">Луцький національний технчний університет </p>

    <p class="content">Луцький національний технчний університет є одним із найкращих професійних закладів освіти у місті Луцьку</p>

    </div>

  </body>

</html>

Результат цього прикладу показаний ні мал. 1.

Мал. 1. Застосування властивості border - bottom - color

Об'єктна модель

[window.]document.getElementById

("elementID").style.borderBottomColor

Браузери

Internet Explorer 6 не підтримує значення transparent. Браузер Internet Explorer до сьомої версії включно не підтримує inherit.

Колір межі в різних браузерах може дещо розрізнятися при використанні значень стилю groove, ridge, inset або outset.